<template>
  <div id="agree-friend-push-body">
    <header id="header" class="mui-bar mui-bar-nav">
      <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left" @click="$router.goBack()"></a>
      <h1 class="mui-title">添加好友</h1>
      <button class="mui-btn mui-btn-blue mui-btn-link mui-pull-right" @click="addFriendData">添加</button>
    </header>
    <div class="agree-friend-push-panel margin-top-60 w-panel">
      <div class="mui-input-row">
        <label>备注:</label>
        <input type="text" placeholder="请输入好友备注" v-model="friendAlias" />
      </div>
      <div class="mui-input-row">
        <label>分组:</label>
        <van-dropdown-menu>
          <van-dropdown-item v-model="friendGroupId" :options="nowUserGroup" />
        </van-dropdown-menu>
      </div>
    </div>
  </div>
</template>
<script>
import Vue from "vue";
import axios from "axios";
import { api } from "../assets/js/api";
import { Toast } from "vant";
import { DropdownMenu, DropdownItem } from "vant";

Vue.use(DropdownMenu).use(DropdownItem);
export default {
  data() {
    return {
      friendAlias: "",
      friendGroupId: "",
      friend_id: "",
      friendCare: 0,
      friendShielding: 0,
      push_id : '',
      nowUserGroup: []
    };
  },
  methods: {
    goBack: function() {
      this.$router.go(-1);
    },
    addFriendData: function() {
        if(this.friendAlias == ""){
            Toast("请输入备注");
            return false;
        }
        if(this.friendGroupId == ""){
            Toast("请选择好友分组");
            return false;
        }
        var data = {
            push_id : this.push_id,
            friend_group : this.friendGroupId,
            friend_alias : this.friendAlias
        }
        axios({
            url : api.friend.agreeFriendPush,
            method : 'post',
            data : data
        }).then((res) => {
            res = res.data;
            if(res.code){
                Toast("添加成功");
                this.$router.go(-1);
                return true;
            }
            Toast(res.msg);
        });
    }
  },
  created() {
      this.push_id = this.$route.query.friend_push_id;
      this.friendAlias = this.$route.query.user_name;
    axios({
      method: "post",
      url: api.friend.getFriendEditGroup
    }).then(res => {
      this.nowUserGroup = res.data.data;
      console.log(res.data.data);
    });
  }
};
</script>
<style>
#agree-friend-push-body .van-dropdown-menu.van-hairline--top-bottom {
  position: absolute;
  left: 125px;
  line-height: 40px;
  height: 40px;
}
</style>